<template>
  <div class="mainContainer">
      <div class="login">
      <el-tabs v-model="activeName">
        <el-tab-pane label="登录" name="login">
          <h3 class="loginTitle">登录</h3>
          <login-child  v-if="activeName === 'login'"></login-child>
        </el-tab-pane>
        <el-tab-pane label="注册" name="register">
          <h3 class="loginTitle">注册</h3>
            <Register v-if="activeName === 'register'"/>
        </el-tab-pane>
      </el-tabs>
<!--    </div>-->
<!--    <div v-if="forgetVisible">-->
<!--      <forget-password @openForget="forgetVisibleValue"/>-->
    </div>
  </div>
</template>

<script>
import loginChild from './compoents/LoginChild'
import Register from "@/views/login/compoents/Register.vue";
export default {
  components: {
      Register,
    loginChild,
  },
  data() {
    return {
      forgetVisible: false,           //是否打开找回密码
      activeName: 'login',                 //标签页名称
      dialogFormVisible: false,       //是否打开登录窗口
      interval: null,                  //定时器
        ipAddress: '192.168.80.11'  // 存储用户输入的远程桌面的IP地址
    }
  },
  methods: {
      openRemoteDesktop() {
          // 使用fetch发送POST请求到Node.js后端
          fetch('http://localhost:8050/api/open-rdp', {
              method: 'POST',
              headers: {
                  'Content-Type': 'application/json'
              },
              body: JSON.stringify({ ipAddress: this.ipAddress })
          })
              .then(response => {
                  console.log(response,"response")
                  if (response.ok) {
                      alert('远程桌面命令已发送!');
                  } else {
                      alert('打开远程桌面时出错');
                  }
              })
              .catch(error => {
                  console.error('请求失败:', error);
              });
      }
  }
}
</script>

<style scoped>
.mainContainer{
  width: 100%;
  height: 100%;
}
.login {
  background-color: #ffffffd6;
  border-radius: 10px;
  width: 21%;
  padding: 0.5%;
  height: 40%;
  position: absolute;
  right: 20px;
  bottom: 20px;
}
.loginTitle {
  text-align: center;
}


</style>